<!DOCTYPE html>
<html lang="en">

<head>
<link href="http://51reboot.com/static/images/favicon.ico" type="image/x-icon" rel="shortcut icon">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>Lmanage</title>

    <!-- Bootstrap Core CSS -->
    <link href="http://cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">

    <!-- MetisMenu CSS -->
    <link href="http://mm.onokumus.com/bower_components/metisMenu/dist/metisMenu.min.css" rel="stylesheet">

    <!-- Custom CSS -->
    <link href="/static/dist/css/sb-admin-2.css" rel="stylesheet">

    <!-- Custom Fonts -->
    <link href="http://cdn.bootcss.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
    <style>
div.dataTables_length label {
    font-weight: normal;
    text-align: left;
    white-space: nowrap;
}

div.dataTables_length select {
    width: 75px;
    display: inline-block;
}

div.dataTables_filter {
    text-align: right;
}

div.dataTables_filter label {
    font-weight: normal;
    white-space: nowrap;
    text-align: left;
}

div.dataTables_filter input {
    margin-left: 0.5em;
    display: inline-block;
}

div.dataTables_info {
    padding-top: 8px;
    white-space: nowrap;
}

div.dataTables_paginate {
    margin: 0;
    white-space: nowrap;
    text-align: right;
}

div.dataTables_paginate ul.pagination {
    margin: 2px 0;
    white-space: nowrap;
}

@media screen and (max-width: 767px) {
    div.dataTables_length,
    div.dataTables_filter,
    div.dataTables_info,
    div.dataTables_paginate {
        text-align: center;
    }
}


table.dataTable td,
table.dataTable th {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}


table.dataTable {
    clear: both;
    margin-top: 6px !important;
    margin-bottom: 6px !important;
    max-width: none !important;
}

table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
    cursor: pointer;
}



table.dataTable thead .sorting_desc { background: url('../images/sort_desc.png') no-repeat center right; }

table.dataTable thead .sorting_asc_disabled { background: url('../images/sort_asc_disabled.png') no-repeat center right; }
table.dataTable thead .sorting_desc_disabled { background: url('../images/sort_desc_disabled.png') no-repeat center right; }

table.dataTable thead > tr > th {
    padding-left: 18px;
    padding-right: 18px;
}

table.dataTable th:active {
    outline: none;
}

/* Scrolling */
div.dataTables_scrollHead table {
    margin-bottom: 0 !important;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

div.dataTables_scrollHead table thead tr:last-child th:first-child,
div.dataTables_scrollHead table thead tr:last-child td:first-child {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

div.dataTables_scrollBody table {
    border-top: none;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

div.dataTables_scrollBody tbody tr:first-child th,
div.dataTables_scrollBody tbody tr:first-child td {
    border-top: none;
}

div.dataTables_scrollFoot table {
    margin-top: 0 !important;
    border-top: none;
}

/* Frustratingly the border-collapse:collapse used by Bootstrap makes the column
   width calculations when using scrolling impossible to align columns. We have
   to use separate
 */
table.table-bordered.dataTable {
    border-collapse: separate !important;
}
table.table-bordered thead th,
table.table-bordered thead td {
    border-left-width: 0;
    border-top-width: 0;
}
table.table-bordered tbody th,
table.table-bordered tbody td {
    border-left-width: 0;
    border-bottom-width: 0;
}
table.table-bordered th:last-child,
table.table-bordered td:last-child {
    border-right-width: 0;
}
div.dataTables_scrollHead table.table-bordered {
    border-bottom-width: 0;
}




/*
 * TableTools styles
 */
.table.dataTable tbody tr.active td,
.table.dataTable tbody tr.active th {
    background-color: #08C;
    color: white;
}

.table.dataTable tbody tr.active:hover td,
.table.dataTable tbody tr.active:hover th {
    background-color: #0075b0 !important;
}

.table.dataTable tbody tr.active th > a,
.table.dataTable tbody tr.active td > a {
    color: white;
}

.table-striped.dataTable tbody tr.active:nth-child(odd) td,
.table-striped.dataTable tbody tr.active:nth-child(odd) th {
    background-color: #017ebc;
}

table.DTTT_selectable tbody tr {
    cursor: pointer;
}

div.DTTT .btn:hover {
    text-decoration: none !important;
}

ul.DTTT_dropdown.dropdown-menu {
  z-index: 2003;
}

ul.DTTT_dropdown.dropdown-menu a {
    color: #333 !important; /* needed only when demo_page.css is included */
}

ul.DTTT_dropdown.dropdown-menu li {
    position: relative;
}

ul.DTTT_dropdown.dropdown-menu li:hover a {
    background-color: #0088cc;
    color: white !important;
}

div.DTTT_collection_background {
    z-index: 2002;  
}

/* TableTools information display */
div.DTTT_print_info {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 400px;
    height: 150px;
    margin-left: -200px;
    margin-top: -75px;
    text-align: center;
    color: #333;
    padding: 10px 30px;
    opacity: 0.95;

    background-color: white;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    
    -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.5);
            box-shadow: 0 3px 7px rgba(0, 0, 0, 0.5);
}

div.DTTT_print_info h6 {
    font-weight: normal;
    font-size: 28px;
    line-height: 28px;
    margin: 1em;
}

div.DTTT_print_info p {
    font-size: 14px;
    line-height: 20px;
}

div.dataTables_processing {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 60px;
    margin-left: -50%;
    margin-top: -25px;
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: center;
    font-size: 1.2em;
    background-color: white;
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255,255,255,0)), color-stop(25%, rgba(255,255,255,0.9)), color-stop(75%, rgba(255,255,255,0.9)), color-stop(100%, rgba(255,255,255,0)));
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 25%, rgba(255,255,255,0.9) 75%, rgba(255,255,255,0) 100%);
    background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 25%, rgba(255,255,255,0.9) 75%, rgba(255,255,255,0) 100%);
    background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 25%, rgba(255,255,255,0.9) 75%, rgba(255,255,255,0) 100%);
    background: -o-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 25%, rgba(255,255,255,0.9) 75%, rgba(255,255,255,0) 100%);
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.9) 25%, rgba(255,255,255,0.9) 75%, rgba(255,255,255,0) 100%);
}



/*
 * FixedColumns styles
 */
div.DTFC_LeftHeadWrapper table,
div.DTFC_LeftFootWrapper table,
div.DTFC_RightHeadWrapper table,
div.DTFC_RightFootWrapper table,
table.DTFC_Cloned tr.even {
    background-color: white;
    margin-bottom: 0;
}
 
div.DTFC_RightHeadWrapper table ,
div.DTFC_LeftHeadWrapper table {
    border-bottom: none !important;
    margin-bottom: 0 !important;
    border-top-right-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}
 
div.DTFC_RightHeadWrapper table thead tr:last-child th:first-child,
div.DTFC_RightHeadWrapper table thead tr:last-child td:first-child,
div.DTFC_LeftHeadWrapper table thead tr:last-child th:first-child,
div.DTFC_LeftHeadWrapper table thead tr:last-child td:first-child {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}
 
div.DTFC_RightBodyWrapper table,
div.DTFC_LeftBodyWrapper table {
    border-top: none;
    margin: 0 !important;
}
 
div.DTFC_RightBodyWrapper tbody tr:first-child th,
div.DTFC_RightBodyWrapper tbody tr:first-child td,
div.DTFC_LeftBodyWrapper tbody tr:first-child th,
div.DTFC_LeftBodyWrapper tbody tr:first-child td {
    border-top: none;
}
 
div.DTFC_RightFootWrapper table,
div.DTFC_LeftFootWrapper table {
    border-top: none;
    margin-top: 0 !important;
}


/*
 * FixedHeader styles
 */
div.FixedHeader_Cloned table {
    margin: 0 !important
}


.hover{
    cursor: pointer;
}
.progress-reboot{
    position: absolute;
    height: 2px;
    top:0px;
    background: #337ab7;
    width: 0%;
    z-index: 2000;
}
#alertText{
    position: absolute;
    line-height: 50px;
    left: 250px;
    color:green;
    font-size: 20px;
}
    </style>
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
        <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->

</head>

<body>
    <div class="progress-reboot" id='progress-reboot'>
    
    </div>
    <div id="wrapper">

        <!-- Navigation -->
        <nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
           	<img src="/static/dist/img/CMDB1.png" height="50px"/> 
            </div>
            <p id="alertText" class='text-success'>
            </p>
            <!-- /.navbar-header -->

            <ul class="nav navbar-top-links navbar-right">
                <!-- /.dropdown -->
                <li class="dropdown">
                    <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                        <i class="fa fa-tasks fa-fw"></i>  <i class="fa fa-caret-down"></i>
                    </a>
                    <ul class="dropdown-menu dropdown-tasks">
                        <li>
                            <a href="#">
                                <div>
                                    <p>
                                        <strong>任务1</strong>
                                        <span class="pull-right text-muted">40%</span>
                                    </p>
                                    <div class="progress progress-striped active">
                                        <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%">
                                            <span class="sr-only">40% Complete (success)</span>
                                        </div>
                                    </div>
                                </div>
                            </a>
                        </li>
                        <li class="divider"></li>
                        <li>
                            <a href="#">
                                <div>
                                    <p>
                                        <strong>任务 2</strong>
                                        <span class="pull-right text-muted">20% </span>
                                    </p>
                                    <div class="progress progress-striped active">
                                        <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" style="width: 20%">
                                            <span class="sr-only">20% Complete</span>
                                        </div>
                                    </div>
                                </div>
                            </a>
                        </li>
                        
                        <li class="divider"></li>
                        <li>
                            <a class="text-center" href="#">
                                <strong>查看全部</strong>
                                <i class="fa fa-angle-right"></i>
                            </a>
                        </li>
                    </ul>
                    <!-- /.dropdown-tasks -->
                </li>
                <!-- /.dropdown -->
                <li class="dropdown">
                    <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                        <i class="fa fa-bell fa-fw"></i>  <i class="fa fa-caret-down"></i>
                    </a>
                    <ul class="dropdown-menu dropdown-alerts">
                        <li class="divider"></li>
                        <li>
                            <a href="#">
                                <div>
                                    <i class="fa fa-envelope fa-fw"></i> 消息1
                                    <span class="pull-right text-muted small">4分钟前</span>
                                </div>
                            </a>
                        </li>
                        <li class="divider"></li>
                        <li>
                            <a href="#">
                                <div>
                                    <i class="fa fa-tasks fa-fw"></i> 分配任务
                                    <span class="pull-right text-muted small">5分钟前</span>
                                </div>
                            </a>
                        </li>
                        <li class="divider"></li>
                        <li>
                            <a class="text-center" href="#">
                                <strong>查看全部提醒</strong>
                                <i class="fa fa-angle-right"></i>
                            </a>
                        </li>
                    </ul>
                    <!-- /.dropdown-alerts -->
                </li>
                <!-- /.dropdown -->
                <li class="dropdown">
                    <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                        <i class="fa fa-user fa-fw"></i>  <i class="fa fa-caret-down"></i>
                    </a>
                    <ul class="dropdown-menu dropdown-user">

<!--                         <li><a href="#"><i class="fa fa-gear fa-fw"></i> 设置</a>
                        </li>
                        <li class="divider"></li>
 -->                        <li><a href="/login"><i class="fa fa-sign-out fa-fw"></i> 退出</a>
                        </li>
                    </ul>
                    <!-- /.dropdown-user -->
                </li>
                <!-- /.dropdown -->
            </ul>
            <!-- /.navbar-top-links -->

            <div class="navbar-default sidebar" role="navigation">
                <div class="sidebar-nav navbar-collapse">
                    <ul class="nav" id="side-menu">
			<li>
                            <a href="/index"><i class="fa fa-dashboard fa-fw"></i> 控制台</a>
                        </li>
                        <li>
                            <a href="/idc"><i class="fa fa-tasks fa-fw"></i>机房管理</a>
                        </li>
                        <li>
                            <a href="/mac"><i class="fa fa-tasks fa-fw"></i>主机管理</a>
                        </li>
                        <li>
                            <a href="/asset"><i class="fa fa-tasks fa-fw"></i>资产审计</a>
                        </li>
                        <li>
                            <a href="/asset_auto"><i class="fa fa-tasks fa-fw"></i>资产采集</a>
                        </li>
                        <li>
                            <a href="/group"><i class="fa fa-support fa-fw"></i>分组管理</a>
                        </li>
                        <li>
                            <a href="/file"><i class="fa fa-support fa-fw"></i>文件推送</a>
                        </li>
                        <li>
                            <a href="/command"><i class="fa fa-support fa-fw"></i>单台命令</a>
                        </li>
                        <li>
                            <a href="/command_group"><i class="fa fa-support fa-fw"></i>批量命令</a>
                        </li>
                        <li>
                            <a href="/job"><i class="fa fa-support fa-fw"></i>任务流程</a>
                        </li>
<!--                         <li>
                            <a href="/chart"><i class="fa fa-bar-chart-o fa-fw"></i> 图表<span class="fa arrow"></span></a>
                            <ul class="nav nav-second-level">
                                <li>
                                    <a href="morris.html">Morris.js Charts</a>
                                </li>
                            </ul>
                        </li> -->

                    </ul>
                </div>
                <!-- /.sidebar-collapse -->
            </div>
            <!-- /.navbar-static-side -->
        </nav>

        <!-- Page Content -->
        <div id="page-wrapper">
            <div class="container-fluid">
          



<div class="row">
                <div class="col-lg-12">
                    <div class="panel panel-default" style='margin-top:20px;'>
<!--                         <div class="panel-heading">
                           idc信息
                            <button class='btn btn-default' id='addIdc'>添加idc</button>
                        </div> -->
                        <!-- /.panel-heading -->
                        <div class="panel-body">

<div style="width:30%">
<form class="form-horizontal"  method="post" action="/command_result/">
  <div class="form-group">
    <label for="inputPassword3" class="col-sm-2 control-label">主机</label>
    <div class="col-sm-10">
   	<select class="form-control" id='ip'>
      {%for host in all_host %}
      <option>{{host.ip}}</option>
      {%endfor%}
     </select> 
    </div>
  </div>
  <div class="form-group">
    <label for="inputPassword3" class="col-sm-2 control-label">命令</label>
    <div class="col-sm-10">
      <input type="text" class="form-control" id='command'> 
    </div>

  </div>
    <!--
      <div class="modal-footer" style="width:50%">
        <button type="button" class="btn btn-primary"  onclick="command_result(this);" >确认</button>
   </div> 
    -->
      <div style="width:150%">
 <button type="button" class="btn btn-primary"  onclick="command_result(this);" >确认</button></br></br>
	  <!--
          <textarea class="form-control" id="result" style="margin: 0px -54.5px 0px 0px; height: 450px; width: 600px;"></textarea>
       -->
	
<div  id="result"></div>


</div>




	<div>   
  </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->                                





                            <!-- /.table-responsive -->
                        </div>
                        <!-- /.panel-body -->
                    </div>
                    <!-- /.panel -->
                </div>
</div>

<div class="modal fade" id='tipModal'>
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">Modal title</h4>
      </div>
      <div class="modal-body">
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">确认</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
    <!-- jQuery -->
    <script src="http://cdn.bootcss.com/jquery/2.1.3/jquery.min.js"></script>
<script src="http://echarts.baidu.com/build/dist/echarts-all.js"></script>
    <!-- Bootstrap Core JavaScript -->
    <script src="http://cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

    <!-- Metis Menu Plugin JavaScript -->
    <script src="http://mm.onokumus.com/bower_components/metisMenu/dist/metisMenu.min.js"></script>
        <script src="http://ironsummitmedia.github.io/startbootstrap-sb-admin-2/bower_components/datatables/media/js/jquery.dataTables.min.js"></script>

    <script src='http://ironsummitmedia.github.io/startbootstrap-sb-admin-2/bower_components/datatables-plugins/integration/bootstrap/3/dataTables.bootstrap.min.js'></script>
    <!-- Custom Theme JavaScript --> 
    <script src="/static/dist/js/sb-admin-2.js"></script>
    <script>
    $('#tipModal').on('hide.bs.modal',function(){
        location.reload()
    })
    $(function(){
           var oLanguage={
        "oAria": {
            "sSortAscending": ": 升序排列",
            "sSortDescending": ": 降序排列"
        },
        "oPaginate": {
            "sFirst": "首页",
            "sLast": "末页",
            "sNext": "下页",
            "sPrevious": "上页"
        },
        "sEmptyTable": "没有相关记录",
        "sInfo": "第 _START_ 到 _END_ 条记录，共 _TOTAL_ 条",
        "sInfoEmpty": "第 0 到 0 条记录，共 0 条",
        "sInfoFiltered": "(从 _MAX_ 条记录中检索)",
        "sInfoPostFix": "",
        "sDecimal": "",
        "sThousands": ",",
        "sLengthMenu": "每页显示条数: _MENU_",
        "sLoadingRecords": "正在载入...",
        "sProcessing": "正在载入...",
        "sSearch": "搜索:",
        "sSearchPlaceholder": "",
        "sUrl": "",
        "sZeroRecords": "没有相关记录"
    }
    $.fn.dataTable.defaults.oLanguage=oLanguage; 
    $('#dataTables-example').DataTable({
            responsive: true,
            // iDisplayLength:3
    });
    });
    var pro = 10
    var timer = null
    timer = setInterval(function(){
        if (pro<100) {

        pro = pro*1.5

        $('#progress-reboot').css('width',pro+'%')
        }else{
            clearInterval(timer)
            $('#progress-reboot').addClass('hide')
        }

    },100)
    var is_right = true
    setInterval(function(){
        var t = $('#alertText')
        var left = parseInt(t.css('left'))
        var val
        if (is_right) {        
            if (left<300) {
                val = left+1
                t.css('left',val)
            }else{
                is_right = false
            }
        }else{
            if (left>250) {
                val = left-1
                t.css('left',val)
            }else{
                is_right = true
            }

        }
        // if (left<300&&left>250) {
        //     t.css('left',left+1)
        // };
    },50)
    </script>
  
           
<script>
	$('#addmacBtn').click(function(){
		$('#addmacModal').modal('show')
	})
	    	$(document).on('click','.deletemac',function(){
	    		var id = $(this).data('id')
	    		$.get('/deletemac?id='+id,function(res){
	    			if (res == 'ok') {
	    				location.reload()
	    			};
	    		})
	    	})
	$('#confirmAddmacBtn').click(function(){
		var is_val = true
		$('#addmacForm').find('input').each(function(i,v){
			if (!$(v).val()) {
				$(v).after('<span class="text-danger">必填字段</span>')
				is_val = false
			}else{
				$(v).next().remove()
			}
		})
		if (is_val) {

		$.get('/addmac',$('#addmacForm').serialize(),function(data){
			if (data=='ok') {
				$('#tipModal').find('.modal-body').html('添加成功').end().modal('show')
			};
		})
		};

	})
</script>

<script type="text/javascript">
function command_result(ele){
   if($('#ip').val()&&$('#command').val()){
     var id=$(ele).attr("id");
  $.ajax({  
    url:"/command_result", 
    data:{ip:$('#ip').val(),command:$('#command').val()},
    success:function(data){
        if (data) { 
       var obj = JSON.parse(data);
       var  com_result = obj.ret.replace(/\\n/g,'<br/>');
          $('#result').html("+++++++" + obj.host + "+++++++&nbsp&nbsp" + "<br/>" + "<pre>" + com_result +"</pre>"); 
      }
        }
    
});
}}   
</script>

</body>

</html>
